<script setup>
/*
  vue2 
     v-model
        <son  :value="appValue"   @input="appValue=$event"    />
        <son  v-model="appValue"     />
        son.vue
          props:['value']
          this.$emit('input',实参值)
  vue3
    v-model:一个组件可以有多个v-model:xxx='值'      
       <son :modelValue="appValue" @update:modelValue="appValue=$event"   /> 
       <son v-model:modelValue="appValue"   /> 
       只有属性名是modelValue时才可以省掉:modelValue
       <son v-model="appValue"   /> 
       son.vue
         const props=defineProps({
          modelValue:{....}
         })
         const emits=defineEmits(['update:modelValue'])
         emits('update:modelValue',实参值)

*/

import { ref } from 'vue'
import HmModel from './components/HmModel.vue'
const num = ref(0)
const xxx = ref(false)
</script>

<template>
  <div class="about-page">
    我是父组件----{{ num }}
    <hr />
    <!-- <HmModel :modelValue="num" @update:modelValue="num = $event"></HmModel> -->
    <!-- <HmModel v-model:modelValue="num"></HmModel> -->
    <!-- <HmModel v-model="num" :xxx="xxx" @update:xxx="xxx = $event"></HmModel> -->
    <HmModel v-model="num" v-model:xxx="xxx"></HmModel>
  </div>
</template>

<style scoped></style>
